<template>
  <!-- 个人中心-个人信息 -->
  <div class="userinfo">
    <!-- 顶部导航 -->
    <div class="userinfo_top">
      <van-nav-bar
        left-arrow
        @click-left="$router.go(-1)"
        fixed
        title="个人信息"
      >
        <template #right>
          <van-icon
            name="wap-home-o"
            size="25"
            @click="$router.push('/home')"
          />
        </template>
      </van-nav-bar>
    </div>

    <!-- 姓名和联系方式 -->
    <div class="name_contact">
      <van-cell-group>
        <van-cell title="姓名" :value="info.name" />
        <van-cell title="联系电话" :value="info.phone" />
      </van-cell-group>
    </div>

    <!-- 个人信息内容 -->
    <div class="userinfo_c">
      <van-cell-group>
        <van-cell title="性别" :value="info.sex" />
        <van-cell title="年薪" :value="info.year_salary" />
        <van-cell title="月薪" :value="info.month_salary" />
        <van-cell title="个人简介" :value="info.remark" />
      </van-cell-group>
    </div>
  </div>
</template>

<script>
import { GetUserInfoDetails } from "@/request/api";
export default {
  data() {
    return {
      info: "",
    };
  },
  created() {
    GetUserInfoDetails().then((res) => {
      this.info = res.data;
    });
  },
};
</script>
 
<style lang = "less" scoped>
.userinfo {
  /* 顶部导航 */
  .userinfo_top {
    padding-bottom: 0.56rem;
    .van-nav-bar {
      background-color: #003399;
    }
    /deep/.van-icon,
    /deep/.van-nav-bar__title {
      color: #ffffff;
    }
  }
  .name_contact {
    padding-bottom: 0.1rem;
  }
}
</style>